<style>
    #febs-history xm-select {
        min-height: 30px;
        line-height: 30px;
    }

    #febs-history xm-select > .xm-label .scroll .label-content {
        display: flex;
        padding: 0 30px 0 10px;
    }
</style>
<div class="layui-fluid layui-anim febs-anim" id="febs-history" lay-title="签核状态查询">
    <div class="layui-row febs-container">
        <div class="layui-col-md12">
            <div class="layui-card">
                <div class="layui-card-body febs-table-full">
                    <form class="layui-form layui-table-form" lay-filter="user-table-form">
                        <div class="layui-row">
                            <div class="layui-col-md10">
                                <div class="layui-form-item">
                                    <div class="layui-inline">
                                        <label class="layui-form-label layui-form-label-sm">厂别</label>
                                        <div class="layui-input-inline">
                                            <select id="orgId" name="orgId">
                                                <option value=""></option>
                                                <!-- <option value="1201">1201-站成AD厂</option>
                                                <option value="9001">9001-AD开发中心</option>
                                                <option value="9002">9002-NB开发中心</option>
                                                <option value="1350">1350-安乡站成底厂</option>
                                                <option value="9003">9003-迪桑特开发中心</option>
                                                <option value="6200">6200-东莞站瑞底厂</option>
                                                <option value="1600">1600-安乡大旺</option>
                                                <option value="1700">1700-阳新龙行天下</option>
                                                <option value="2300">2300-越南富存</option>
                                                <option value="2400">2400-越南大可</option>
                                                <option value="1500">1500-龙行天下（二厂）</option>
                                                <option value="1301">1301-湖南NB厂</option>
                                                <option value="8100">8100-站佳事业部</option>
                                                <option value="9000">9000-东莞站成研创</option>
                                                <option value="1100">1100-东莞站成一厂</option>
                                                <option value="1200">1200-东莞站成二厂</option>
                                                <option value="1300">1300-湖南一厂</option>
                                                <option value="1400">1400-钟祥鞋厂</option>
                                                <option value="2100">2100-越南一厂</option>
                                                <option value="2200">2200-越南二厂</option>
                                                <option value="6100">6100-湖南站成底厂</option>
                                                <option value="5100">5100-东莞喜悦鞋材</option>
                                                <option value="6400">6400-钟祥底厂</option>
                                                <option value="2600">2600-龙行天耀</option>
                                                <option value="7100">7100-原力3D</option>
                                                <option value="7200">7200-杰富亿</option>
                                                <option value="1501">1501-常德站成</option> -->
                                            </select>
                                        </div>
                                    </div>
                                    <div class="layui-inline">
                                        <label class="layui-form-label layui-form-label-sm">单据分类</label>
                                        <div class="layui-input-inline">
                                            <select id="billstdNo" name="billstdNo">
                                                <option value=""></option>
                                            </select>
                                        </div>
                                    </div>
                                    <div class="layui-inline">
                                        <label class="layui-form-label layui-form-label-sm">单据</label>
                                        <div class="layui-input-inline">
                                            <input type="text" name="orderNo" autocomplete="off" class="layui-input"/>
                                        </div>
                                    </div>
                                    <div class="layui-inline">
                                        <label class="layui-form-label layui-form-label-sm">送签人员</label>
                                        <div class="layui-input-inline">
                                            <input type="text" name="grtUserCname" autocomplete="off"
                                                   class="layui-input"/>
                                        </div>
                                    </div>

                                    <div class="layui-inline">
                                        <label class="layui-form-label layui-form-label-sm">送签日期</label>
                                        <div class="layui-input-inline">
                                            <input type="text" name="time" id="user-signTime" class="layui-input"/>
                                        </div>
                                    </div>

                                    <div class="layui-inline">
                                        <label class="layui-form-label layui-form-label-sm">状态</label>
                                        <div class="layui-input-inline">
                                            <select name="status">
                                                <option value="">全部</option>
                                                <option value="1">待签单据</option>
                                                <option value="99">已签单据</option>
                                            </select>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="layui-col-md2 layui-col-sm12 layui-col-xs12 table-action-area">
                                <div class="layui-btn layui-btn-sm layui-btn-primary febs-button-blue-plain table-action"
                                     id="query">
                                    <i class="layui-icon">&#xe848;</i>
                                </div>
                                <div class="layui-btn layui-btn-sm layui-btn-primary febs-button-green-plain table-action"
                                     id="reset">
                                    <i class="layui-icon">&#xe79b;</i>
                                </div>
                                <div
                                        class="layui-btn layui-btn-sm layui-btn-primary table-action action-more"
                                        shiro:hasAnyPermissions="history:add,history:update,history:sign,history:export"
                                >
                                    <i class="layui-icon">&#xe875;</i>
                                </div>
                            </div>
                        </div>
                    </form>
                    <table lay-filter="historyTable" lay-data="{id:'historyTable'}"></table>
                </div>
            </div>
        </div>
    </div>
</div>
<script type="text/html" id="history-status">
    {{# let status = { 99: {title: '已签', color: 'green'}, 1: {title: '待签', color: 'volcano'} }[d.status]; }}
    <span class="layui-badge {{status?'febs-bg-'+status.color:''}}">{{status?status.title:'其他'}}</span>
</script>
<script type="text/html" id="history-view">
    <a lay-event="detail" shiro:hasPermission="approvals:view"><i
            class="layui-icon febs-edit-area febs-green"></i>详情</a>
    <a lay-event="flow" shiro:hasPermission="approvals:view"><i class="layui-icon febs-edit-area febs-blue"></i>流程</a>
</script>

<!-- <script type="text/html" id="history-billstdNo">
    {{#
    let billstdNo = {
    DESTORY: {title: '量产销毁'},
    DESTORY_Y: {title: '样品销毁'}
    }[d.billstdNo];
    }}
    <span>{{ billstdNo.title }}</span>
</script> -->

<!-- <script type="text/html" id="history-orgId">
  {{# let orgId = { 1201: {title: '站成AD厂'}, 9001: {title: 'AD开发中心'}, 9002: {title: 'NB开发中心'}, 1350: {title: '安乡站成底厂'}, 9003: {title:
  '迪桑特开发中心'}, 6200: {title: '东莞站瑞底厂'}, 1600: {title: '安乡大旺'}, 1700: {title: '阳新龙行天下'}, 2300: {title: '越南富存'}, 2400: {title:
  '越南大可'}, 1500: {title: '龙行天下（二厂）'}, 1301: {title: '湖南NB厂'}, 8100: {title: '站佳事业部'}, 9000: {title: '东莞站成研创'}, 1100: {title:
  '东莞站成一厂'}, 1200: {title: '东莞站成二厂'}, 1300: {title: '湖南一厂'}, 1400: {title: '钟祥鞋厂'}, 2100: {title: '越南一厂'}, 2200: {title:
  '越南二厂'}, 6100: {title: '湖南站成底厂'}, 5100: {title: '东莞喜悦鞋材'}, 6400: {title: '钟祥底厂'}, 2600: {title: '龙行天耀'}, 7100: {title:
  '原力3D'}, 7200: {title: '杰富亿'}, 1501: {title: '常德站成'} }[d.orgId]; }}
  <span>{{ orgId.title }}</span>
</script> -->
<script type="text/html" id="history-option">
    <span shiro:lacksPermission="history:view,history:update,history:sign"> <span
            class="layui-badge-dot febs-bg-orange"></span> 无权限 </span>
</script>
<script data-th-inline="none" type="text/javascript">
    layui.use(["dropdown", "jquery", "laydate", "form", "table", "febs", "api"], function () {
        let $ = layui.jquery,
            laydate = layui.laydate,
            febs = layui.febs,
            form = layui.form,
            table = layui.table,
            dropdown = layui.dropdown,
            api = layui.api,
            $view = $("#febs-history"),
            $query = $view.find("#query"),
            $reset = $view.find("#reset"),
            $searchForm = $view.find("form"),
            sortObject = {field: "sendTime", type: null},
            tableIns,
            createTimeFrom,
            createTimeTo;
        //渲染类型下拉菜单
        febs.get(ctx + "baseflow/getList", null, function (datas) {
            const basestdNoes = datas.data;
            // console.log('basestdNoes',basestdNoes)
            $.each(basestdNoes, function (index, item) {
                $("#billstdNo").append(new Option(item.billstdNo + "-" + item.billstdNm, item.billstdNo)); // 下拉菜单里添加元素
                //重新渲染
                layui.form.render("select");
            });
        });
        //渲染机构下拉菜单
        febs.get(ctx + "classify/getOrgList", null, function (datas) {
            const basestdNoes = datas.data;
            // console.log('basestdNoes',basestdNoes)
            $.each(basestdNoes, function (index, item) {
                $("#orgId").append(new Option(item.orgId + "-" + item.shortnmT, item.orgId)); // 下拉菜单里添加元素
                //重新渲染
                layui.form.render("select");
            });
        });
        form.render();

        initTable();

        laydate.render({
            elem: "#user-signTime",
            range: true,
            trigger: "click",
        });

        dropdown.render({
            elem: $view.find(".action-more"),
            click: function (name, elem, event) {
                let checkStatus = table.checkStatus("historyTable");
            },
        });

        /* 监听行事件*/
        table.on("tool(historyTable)", function (obj) {
            let data = obj.data,
                layEvent = obj.event;
            console.log(obj.data); //得到当前行数据
            sessionStorage.setItem("parameterData", JSON.stringify(obj.data));
            if (layEvent === "detail") {
                //详情
                let str = window.location.href;
                let num = str.indexOf("index#"); //返回NUM
                let openUrl = str.substring(0, num) + "febs/views/approval/approvals/approvalsDetail";
                console.log("openUrl", openUrl);
                window.open(openUrl);
            }
            if (layEvent === "flow") {
                febs.modal.view("流程信息", "/approval/approvals/signDetails", {
                    area: $(window).width() <= 750 ? "95%" : "760px",
                    offset: "auto",
                });
            }
        });
        table.on("sort(historyTable)", function (obj) {
            sortObject = obj;
            tableIns.reload({
                initSort: obj,
                where: $.extend(getQueryParams(), {
                    field: obj.field,
                    order: obj.type,
                }),
            });
        });

        $query.on("click", function () {
            let params = $.extend(getQueryParams(), {field: sortObject.field, order: sortObject.type});
            tableIns.reload({where: params, page: {curr: 1}});
        });
        $reset.on("click", function () {
            $searchForm[0].reset();
            sortObject.type = "null";
            createTimeTo = null;
            createTimeFrom = null;
            tableIns.reload({where: getQueryParams(true), page: {curr: 1}, initSort: sortObject});
        });

        function initTable() {
            tableIns = febs.table.init({
                elem: $view.find("table"),
                id: "historyTable",
                url: ctx + "history/list",
                // parseData: (res) => {
                //   console.log(res);
                //   res.data.rows.forEach((res) => {
                //     res.billstdNm = api.nameFormate(res.billstdNo);
                //     res.orgNm = api.getOrgNm(res.orgId);
                //   });
                parseData: function (res) {
                    console.log(res);
                    res.data.rows.forEach(function (res) {
                        res.billstdNm = api.nameFormate(res.billstdNo);
                        res.orgNm = api.getOrgNm(res.orgId);
                    });
                    return {
                        code: 0, //解析接口状态
                        data: res.data.rows, //解析数据列表
                        count: res.data.total, //解析数据长度
                    };
                },
                cols: [
                    [
                        {type: "checkbox"},
                        {field: "orgNm", title: "组织机构"},
                        {field: "billstdNm", title: "单据类别", minWidth: 100},
                        {field: "orderNo", title: "单据编号"},
                        {field: "grtUserCname", title: "送签人员"},
                        {field: "sendTime", title: "送签时间", minWidth: 125},

                        {field: "orgId", title: "组织id", hide: true},
                        {field: "status", title: "签核状态", hide: true},
                        {field: "chkmgrId", title: "签核id", hide: true},
                        {field: "factEtime", title: "时间转换禁用", hide: true},
                        {title: "状态", templet: "#history-status"},
                        {title: "操作", templet: "#history-view"},
                    ],
                ],
            });
        }

        function getQueryParams(flag) {
            let params = $searchForm.serializeJson();
            let sendTime = params.time;
            if (sendTime) {
                createTimeFrom = sendTime.split(" - ")[0];
                createTimeTo = sendTime.split(" - ")[1];
            }
            params.invalidate_ie_cache = new Date();
            params.createTimeFrom = createTimeFrom;
            params.createTimeTo = createTimeTo;
            return params;
        }
    });
</script>
